<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>悬浮窗</title>
  <style>
    /* 保持原始样式不变 */
    body {
      margin: 0;
      padding: 0;
      background: transparent;
      width: 100vw;
      height: 100vh;
      overflow: hidden !important;
      position: relative;
    }
    body {
      clip-path: circle(50% at 50% 50%);
      -webkit-clip-path: circle(50% at 50% 50%);
    }
    .float-btn {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background: #ffc107;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      color: #fff;
      user-select: none;
      cursor: move;
      touch-action: none;
    }
  </style>
</head>
<body>
  <div class="float-btn" id="floatBtn">译</div>
  <script>
    var floatBtn = document.getElementById('floatBtn');
    
    // 点击悬浮按钮时，跳转到 float_dialog.html 页面
    floatBtn.addEventListener('click', function() {
      console.log("点击悬浮按钮，跳转到浮动对话框页面");
      
      // 向宿主页面发送消息
      if (window.Android && window.Android.callback) {
        var msg = { type: 'openDialog', data: '悬浮窗消息' };
        // 使用插件的 Android.callback 发送消息
        window.Android.callback("sendMessage", JSON.stringify(msg));
      }

      // 跳转到新的页面
     // window.location.href = 'float_dialog.html';  // 跳转到新的对话框页面
    });
  </script>
</body>
</html>
